<template>
    <div class="otuo" style="position:fixed;top:0;width:100%;left:0;height:auto;bottom:0;overflow-y:auto;-webkit-overflow-scrolling:auto;background:#fff;">
      <div class="main-inner">
        <div class="newtop" :style="{backgroundImage: 'url(' + (coverImgUrl ? list.cover : list.cover) + ')', backgroundSize:'100% cover'}"> 
            <div class="xian"></div>
        </div>
       <div class="newbox">
            <div class="newtitle">{{list.title}}</div>
            <div class="newtide">鸿包惠</div>
            <!-- /{{list.created_at}} -->
            <div class="ove">
              <div class="newmainb" v-html="list.content">
                 
              </div> 
            </div>  
        </div> 
      </div>
    </div>
</template>

<script> 
import Vue from 'vue'

export default {
  name: "hbh",
  data() { 
    return {
      list:[],
      coverImgUrl:''
    };
  },
  methods:{  
    orders: function(i,b) {
				let self = this; 
				let url = "/api/new/detail";
				self.httpPost(url,{id:i,category_id:b},function(res) {
				if (res.code == 200) {  
					 self.list=res.data;
				} 
      })
		},

  },
  created() {
       document.title="资讯详情" ;
       this.id = this.$route.query.id;
       this.category_id = this.$route.query.category_id;
       this.orders(this.id,this.category_id)
  },
};
</script>

<style>
 .newtop{
   position: relative;
   height: 3.5rem;
   background-size:cover;
   overflow: hidden; 
 } 
 .ove{
   overflow: hidden;
 }
 .newtop img{
   width: 100%;
 }
 .xian{
   position: absolute;
   left:50%;
   top: 85%;
   width: 120%;
   height: 1.3rem;
   z-index: 9;
   transform: translateX(-50%);
   background: #fff;
   border-top-left-radius: 100%;
   border-top-right-radius: 100%;
 }
 .newbox{
   padding: 0 .1rem;
 }
 .newtitle{
   width: 80%;
   margin-left: 10%;
   text-align: center;
   color: #2C2C2C;
   font-size: .5rem;
   line-height: .63rem;
 }
 .newtide{
   text-align: center;
   color: #969696;
   font-size: .28rem;
 }
 .newmainb{
    margin-top: .3rem;
 }
 .otuo{
     /* position:fixed;
     top:0;
     left:0;
     height:auto;
     bottom:0;
     overflow-y:auto;
     -webkit-overflow-scrolling:touch; */ 
     -webkit-transform: translate3d(0,0,0); 
     -moz-transform: translate3d(0,0,0); 
     -ms-transform: translate3d(0,0,0); 
     transform: translate3d(0,0,0);  
 } 
</style>
